<template>
  <el-form
    ref="ruleFormRef"
    :model="formInline"
    :rules="formRules"
    label-width="auto"
    label-position="top"
    v-loading="isLoading"
  >
    <el-row :gutter="30">
      <re-col :value="24" :xs="24" :sm="24">
        <el-form-item :label="titles?.projectName" prop="projectName">
          {{ isNullOrEmpty( operate.projectName ) }}
          <!-- <el-input v-model.trim='formInline.projectName' clearable :placeholder='prompt?.projectName' /> -->
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.groupName" prop="groupName">
          <el-input :maxlength="30" :show-word-limit="true" v-model.trim="formInline.groupName" clearable :placeholder="prompt?.groupName" />
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.mainteUid" prop="mainteUid">
          <authorizeuserproject v-model="formInline.mainteUid" :projectId="operate.checkedProject" clearable :isid="1"
            placeholder="请选择" :style="{ width: '100%' }" @blur="formValidateField(ruleFormRef, 'mainteUid')"/>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.scrapUid" prop="scrapUid">
          <authorizeuserproject :isid="1" :projectId="operate.checkedProject" v-model="formInline.scrapUid" clearable
            placeholder="请选择" :style="{ width: '100%' }" @blur="formValidateField(ruleFormRef, 'scrapUid')"/>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.expireUid" prop="expireUid">
          <authorizeuserproject  :projectId="operate.checkedProject" v-model="formInline.expireUid" clearable :isid="1" placeholder="请选择"
            :style="{ width: '100%' }" @blur="formValidateField(ruleFormRef, 'expireUid')"/>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.noticeMode" prop="noticeMode">
          <el-checkbox-group v-model="formInline.noticeMode">
            <el-checkbox v-for="item in NOTICE_TYPE" :value="item.value" :label="item.label">
            </el-checkbox>
          </el-checkbox-group>
          <!-- <el-input v-model.trim='formInline.noticeMode' clearable :placeholder='prompt?.noticeMode' /> -->
        </el-form-item>
      </re-col>
    </el-row>
  </el-form>
</template>

<script setup lang="ts">
import { isNullOrEmpty } from '@/utils/functions'
import { usePageVariablesStoreHook, UNIT_TYPE_VIEW_Map } from '@/store/modules/pageVariables'
const operate = usePageVariablesStoreHook().getOperate()
import { ref, reactive } from "vue";
import ReCol from "@/components/ReCol";
import authorizeuserproject from "@/components/select/authorizeuser/authorizeuserproject.vue";
import type { FormRules } from "element-plus";
import { titles, prompt } from "./index";
import { NOTICE_TYPE } from "@/constant/projectManagement";
import { getInfo } from "@/api/operate/project-management/projectManagement/index";
import type { infoType } from "@/api//operate/project-management/project-management/facility-grouping/index";
import { formValidateField } from '@/utils/functions'
type FormProps = {
  formInline: infoType;
  isLoading: boolean;
};

const props = withDefaults(defineProps<FormProps>(), {
  formInline: () => ({}) as infoType,
  isLoading: false
});
const projectName = ref("");
onMounted(() => {
});
//获取项目名称

const formRules = reactive(<FormRules>{
	groupName:[
		{ required: true, message: "请输入分组名称", trigger: 'blur' }
	],
	expireUid: [
		{ required: true, message: "请选择到期提醒人", trigger: 'blur' }
	],
	mainteUid:[
		{ required: true, message: "请选择维保提醒人",trigger: 'blur' }
	],
	scrapUid:[
		{ required: true, message: "请选择报废提醒人", trigger: 'blur' }
	],
	noticeMode: [
		{ required: true, message: "请选择通知方式", trigger: 'blur' }
	]
});
const ruleFormRef = ref();
//    const newFormInline = ref(props.formInline as any);
//
//
//    watch(()=>props.formInline,()=>{
//    	newFormInline.value = props.formInline
//    },{
//    	deep:true,
//    	immediate:true
//    })
function getRef() {
  return ruleFormRef.value;
}

defineExpose({ getRef });
</script>
<style lang="scss" scoped>
.pickerW {
  width: 100% !important;
}
</style>
